<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="/commons/global.jsp" %>
<!DOCTYPE html>
<html>
<head>
    <%@ include file="/commons/basejs.jsp" %>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>标签管理</title>
    <script type="text/javascript">

    </script>
</head>
<body>
<script type="text/javascript">
    $(function() {
        $('#categoryAddPid').combotree({
            url : '${path }/category/allTree.do',
            parentField : 'pid',
            lines : true,
            panelHeight : 'auto'
        });

        $('#categoryAddForm').form({
            url : '${path }/category/add.do',
            onSubmit : function() {
                progressLoad();
                var isValid = $(this).form('validate');
                if (!isValid) {
                    progressClose();
                }
                return isValid;
            },
            success : function(result) {
                progressClose();
                result = $.parseJSON(result);
                if (result.success) {
                    parent.$.modalDialog.openner_treeGrid.treegrid('reload');//之所以能在这里调用到parent.$.modalDialog.openner_treeGrid这个对象，是因为category.jsp页面预定义好了
                    parent.indexMenuZTree.reAsyncChildNodes(null, "refresh");
                    parent.$.modalDialog.handler.dialog('close');
                } else {
                    var form = $('#categoryAddForm');
                    parent.$.messager.alert('提示', eval(result.msg), 'warning');
                }
            }
        });
        
    });
</script>
<div style="padding: 3px;">
    <form id="categoryAddForm" method="post">
        <table class="grid">
            <tr>
                <td>分类名称</td>
                <td><input name="name" type="text" placeholder="请输入分类名称" class="easyui-validatebox span2" data-options="required:true" ></td>

            </tr>
            <tr>
                <td>分类logo</td>
                <td>
                    <div id="upload_ue"></div>
                    <div><img id="logoUrl" src="" height="80" width="80"></div>
                </td>

                <td> <input type="hidden" id="picture" name="logo" />
                    <input type="button" onclick="upImage();" value="上传图片">
                </td>

            </tr>
            <tr>
                <td>排序</td>
                <td><input name="ord" value="0"  class="easyui-numberspinner" style="width: 140px; height: 29px;" required="required" data-options="editable:true"></td>
            </tr>
            <tr>
                <td>状态</td>
                <td>
                    <select name="status" class="easyui-combobox" data-options="width:140,height:29,editable:false,panelHeight:'auto'">
                        <option value="1">启用</option>
                        <option value="0">停用</option>
                    </select>
                </td>

            </tr>
            <tr>
                <td>父分类</td>
                <td colspan="3">
                    <select id="categoryAddPid" name="parentId" style="width: 200px; height: 29px;"></select>
                    <a class="easyui-linkbutton" href="javascript:void(0)" onclick="$('#categoryAddPid').combotree('clear');" >清空</a>
                </td>
            </tr>
        </table>
    </form>
    <script type="text/javascript">

        var _editor;
        $(function() {
            //重新实例化一个编辑器，防止在上面的editor编辑器中显示上传的图片或者文件
            _editor = UE.getEditor('upload_ue',{
                serverUrl:"${path}/file/upload.do?compress=1"
            });

            _editor.ready(function () {
                //设置编辑器不可用
                // _editor.setDisabled();
                //隐藏编辑器，因为不会用到这个编辑器实例，所以要隐藏
                _editor.hide();
                //侦听图片上传
                _editor.addListener('beforeInsertImage', function (t, arg) {
                    //有多少张图片arg.length就是多大
                    $("#picture").val(arg[0].src);
                    $("#logoUrl").attr('src',arg[0].src);
                });
            });
        });
        //弹出图片上传的对话框
        function upImage() {
            var myImage = _editor.getDialog("insertimage");
            myImage.open();
        }
    </script>
</div>
</body>
</html>